<template>
	<view class="wrap" style="padding-bottom: 120px;">
		<view class="example-body">
			<view>
				<u-form>
					<u-form-item label="库房" label-width="170">
						<uni-data-select placeholder="请选择库房"
						class="my-input"
						v-model="from.kuf_no" :localdata="kufList"
							@change="changeKuf"></uni-data-select>
					</u-form-item>
					<u-form-item label="区域" label-width="170">
						<uni-data-select placeholder="请选择区域"
						class="my-input"
						:disabled="notChangeQuyNo" v-model="from.quy_no" :localdata="quNoList"
							@change="changeQuyNo"></uni-data-select>
					</u-form-item>
					<u-form-item label="点位码" label-width="170">
						<u-input
						class="my-input"
						 @click="changeScanInput('from.landpoint')"
						 placeholder="请输入点位码"
						 v-model="from.landpoint" @blur="blurFunction"></u-input>
					</u-form-item>
					<u-form-item label="空托数量" label-width="170">
						<u-input
						class="my-input"
						 @click="changeScanInput('from.tpNum')" placeholder="请输入空托数量" type="number"
						 v-model="from.tpNum" @blur="blurFunction"></u-input>
					</u-form-item>
					<!-- <u-form-item label="空托数量" label-width="170">
						<uni-data-select placeholder="请选择空托数量"
						class="my-input"
						v-model="from.tpNum" :localdata="rangeNum"
							@change="changeTpNum"></uni-data-select>
					</u-form-item> -->
					<u-form-item label="托盘号" label-width="170">
						<u-input v-model="from.tpbar"
						class="my-input"
						placeholder="请输入托盘号"
						@click="changeScanInput('from.tpbar')"
						@blur="blurFunction"></u-input>
					</u-form-item>
				</u-form>
				<view style="margin: 460rpx;"></view>
			</view>


			<view>
				<!-- 提示窗示例 -->
				<uni-popup ref="alertDialog" type="dialog">
					<uni-popup-dialog :type="msgType"
					cancelText="关闭"
					confirmText="重新空托入库"
					title="入库失败"
						:content="errContent"
						@confirm="dialogConfirm"
						@close="dialogClose"></uni-popup-dialog>
				</uni-popup>
			</view>
			<view style="height: 400rpx;">

			</view>

		</view>
		<u-row  class="bottom-box" justify="center">
			<u-col span="10">
				<view><u-button class="button" type="primary"
				shape="circle" @click="submitTpIn">空托入库</u-button>
				</view>
			</u-col>
		</u-row>
	</view>
</template>
<script>
	export default {
		components: {

		},

		data() {
			return {
				// 给一个初始值
				scanInput: '',
				scanResult: '',
				msgType: 'success',
				dialog: '',
				notChangeQuyNo:true,
				from: {
					kuf_no: '',
					quy_no: '',
					gztid: '',
					tpNum: '1',
					//1：空托入库2：空托出库
					czlx: '1',
					landpoint: 'DHJ01',
					tpbar:''
				},
				errContent: '未知错误,请重试',
				//库房
				kufList: [],
				//区域
				quNoList: [],
				//库别
				kubList: [],
				//工作台
				gztList: [],
				rangeNum: [{
						value: 1,
						text: "1"
					},
					{
						value: 2,
						text: "2"
					},
					{
						value: 3,
						text: "3"
					},
					{
						value: 4,
						text: "4"
					},
					{
						value: 5,
						text: "5"
					},
					{
						value: 6,
						text: "6"
					},
					{
						value: 7,
						text: "7"
					},
					{
						value: 8,
						text: "8"
					},
					{
						value: 9,
						text: "9"
					},
					{
						value: 10,
						text: "10"
					}
				],
				mxList: [],
			}
		},
		onUnload() {
			// 移除监听事件
			uni.$off('scancodedate')
		},
		onLoad() {
			//激光扫描监听事件
			var _this = this
			uni.$on("scancodedate", async (res) => {
				console.log("空托入库页面监听到的async:" + res); //我是全局事件订阅的调用方法
				this.scanResult = JSON.stringify(res);
				setTimeout(() => {
					this.changeScanValue()
				}, 20);


			})

			this.from.kuf_no = uni.getStorageSync("in-emput-try-kuf_no")
			this.getKufbyKuf()
			setTimeout(()=>{
				this.from.quy_no = uni.getStorageSync("in-emput-try-quy_no")
				// this.from.quy_no ="直接是缓存中的值"
			},1000)
			this.from.tpNum=uni.getStorageSync("in-emput-try-landpoint")

		},
		created() {
			this.getKuf(2)
			// this.getKuf(3)
			this.getGzt()
		},
		// 数据变化适用
		onShow() {

		},
		methods: {
			// 判定点击的哪个输入框
			changeScanInput(inputItem) {
				console.log(inputItem)
				this.scanInput = inputItem
				//this.$u.toast(JSON.stringify(inputItem))
			},
			// 扫描后执行的方法,判断输入框并绑定值,可以自行跳转,或者扫描完执行某方法,
			changeScanValue() {
				let scanInput = this.scanInput
				let result = JSON.parse(this.scanResult)
				if ("from.landpoint" === scanInput) {
					console.log("this.from.landpoint")
					this.from.landpoint = result
				} else if("from.tpbar" === scanInput){
					this.from.tpbar = result
				} else {
					// this.$u.toast('没有预先适配:' + scanInput)
					console.log('没有预先适配:' + scanInput)
				}
			},
			//失去焦点
			blurFunction(){
				this.updageFrom()
			},
			// 更新from
			updageFrom(){
				 uni.setStorageSync("in-emput-try-landpoint",this.from.tpNum)
				console.log("点位码缓存:"+uni.getStorageSync("in-emput-try-landpoint"))
				// uni.setStorageSync("in-emput-try-tpbar",this.from.tpbar)
				// console.log("点位码缓存:"+uni.getStorageSync("in-emput-try-tpbar"))
			},
			// 将区域可选
			canChangeQuy_no(){
				this.notChangeQuyNo = false

			},
			dialogConfirm() {
				this.submitTpIn()
			},
			dialogClose() {
				console.log('点击关闭')
			},
			change(e) {
				console.log("e:" + e);
			},
			changeKuf(e) {
				console.log("e:" + e);
				// const item = this.kufList[e];
				// console.log("item:"+item)
				this.from.kuf_no = e
				// 判断一下区域是不是在这个库房,如果在,就不更改区域,如果不在,就更改区域
				this.getKufbyKuf()
				this.notChangeQuyNo = e ? false : true

				uni.setStorageSync("in-emput-try-kuf_no",e)
				console.log("呼叫托盘缓存库房号:"+uni.getStorageSync("in-emput-try-kuf_no"))

			},
			changeQuyNo(e) {
				this.from.quy_no = e
				uni.setStorageSync("in-emput-try-quy_no",e)
				console.log("呼叫托盘缓存区域号:"+uni.getStorageSync("in-emput-try-quy_no"))
			},
			changeGztId(e) {
				console.log("changeGztId    e:" + e);
				this.from.gztid = e
			},
			changeTpNum(e) {
				this.from.tpNum = e
				this.updageFrom()
			},
			// 查看选择到的库房的区域
			getKufbyKuf() {
				const USER_ID = uni.getStorageSync('USER_ID')
				const KUB = '%'
				const KUF_NO = this.from.kuf_no ? this.from.kuf_no : "%"
				//1获取库别，2获取库房，3获取区域
				const GET_TYPE = 3
				let param = USER_ID + "," + KUB + "," + KUF_NO + "," + GET_TYPE;
				console.log(param)
				this.$u.api.general({
						iv_code: "GETKUFQUYNO",
						iv_parm: param
					})
					.then(res => {
						console.log("返回的res:" + JSON.stringify(res))
						let data = res.data
						console.log("查看选择到的库房的区域返回的data:" + JSON.stringify(data))
						if (res.success) {
							console.log("hello")
							//补充text
							let newData = data.filter((item) => {
								// 过滤如果有对象的区域参数和已经够选择的区域no相同,那么就不用覆盖已经选择的
								return item.QUY_NO === this.from.quy_no
							})
							if(newData.length>0){
								console.log("不用重新选择,这是从对象集合种筛出来的区域号相同的对象=>"+JSON.stringify(newData))
							}else{
								console.log("重新选择,这是库房对应的对象集合,=>"+JSON.stringify(data))
								this.quNoList=data.map(v => {
									this.$set(v, 'text', v.QUY_NO)
									this.$set(v, 'value', v.QUY_NO)
									return v
								})
								//如果切换的区域
								this.from.quy_no=''
							}
							this.canChangeQuy_no()




						} else {
							this.errContent = res.msg
							this.$u.toast(res.msg);
						}
					});
			},
			getKuf(type) {
				console.log("6666666666666")
				const USER_ID = uni.getStorageSync('USER_ID')
				const KUB = '%'
				const KUF_NO = "%"
				//1获取库别，2获取库房，3获取区域
				const GET_TYPE = type
				let param = USER_ID + "," + KUB + "," + KUF_NO + "," + GET_TYPE;
				console.log(param)
				this.$u.api.general({
						iv_code: "GETKUFQUYNO",
						iv_parm: param
					})
					.then(res => {
						// console.log("返回的res:" + JSON.stringify(res))
						let data = res.data
						console.log("kuf返回的data:" + JSON.stringify(data))
						if (res.success) {
							//补充text
							// this.kufList = data

							if (type == "2") {
								this.kufList = data.map(v => {
									this.$set(v, 'text', v.KUF_NO)
									this.$set(v, 'value', v.KUF_NO)
									return v
								})
							} else if (type == "3") {
								this.quNoList = data.map(v => {
									this.$set(v, 'text', v.QUY_NO)
									this.$set(v, 'value', v.QUY_NO)
									return v
								})
							} else {
								this.kubList = data.map(v => {
									this.$set(v, 'text', v.KUB)
									this.$set(v, 'value', v.KUB)
									return v
								})
							}

						} else {
							this.errContent = res.msg
							this.$u.toast(res.msg);
						}
					});
			},
			getGzt() {
				const user_id = uni.getStorageSync('USER_ID')
				const STORAGE_ID = uni.getStorageSync('STORAGE_ID')
				const kuf = this.from.kuf_no ? this.from.kuf_no : "%"
				const gztType = "1"
				const gztId = "%"
				let param = user_id + "," + STORAGE_ID + "," + kuf + "," + gztType + "," + gztId;
				console.log(param)
				this.$u.api.general({
						iv_code: "GETGZTINFO",
						iv_parm: param
					})
					.then(res => {
						// console.log("返回的res:" + JSON.stringify(res))
						let data = res.data
						console.log("返回的data:" + JSON.stringify(data))
						if (res.success) {
							//补充text
							this.gztList = data.map(v => {
								this.$set(v, 'text', v
									.GZTNAME
								) // https://vuejs.org/v2/guide/reactivity.html
								this.$set(v, 'value', v.GZTID)
								return v
							})
						} else {
							this.$u.toast(res.msg);
						}
					});
			},
			submitTpIn() {
				// 1、IV\_STAFF 用户id
				// 2、IV\_KUF\_NO库房
				// 3、IV\_QUY\_NO 区域
				// 4、IV\_GZTID工作站id
				// 5、IV_TPBAR 托盘号
				// 6、IN\_TPNUM 托盘数量：默认1
				// #、IV\_CZLX 操作类型：1：空托入库2：空托出库

				const USER_ID = uni.getStorageSync('USER_ID')
				const kuf_no = this.from.kuf_no ? this.from.kuf_no : "%"
				const quy_no = this.from.quy_no ? this.from.quy_no : "%"
				// const gztid = this.from.gztid ? this.from.gztid : "%"
				const landpoint = this.from.landpoint ? this.from.landpoint : ''

				const tpbar=this.from.tpbar ? this.from.tpbar : ''

				const tpNum = this.from.tpNum ? this.from.tpNum : "1"
				// const czlx = this.from.czlx ? this.from.czlx : "%"
				let param = USER_ID + "," + kuf_no + "," + quy_no + "," + landpoint + "," +tpbar+","+ tpNum
				 // + "," + czlx;
				console.log("iv_parm:" + param + ";")
				let that = this
				this.$u.api.prcutlexecvar({
						iv_code: "CALLKTPRK",
						iv_parm: param,
						ov_var1: '2',
						ov_var2: '2',
						ov_var3: '2',
						ov_var4: '2',
						ov_var5: '2',
					})
					.then(res => {
						console.log("返回的res:" + JSON.stringify(res))
						// that.$u.toast(res.msg);
						// that.$refs.uToast.show({
						// 					title: res,
						// 					type: 'info',

						// 				})

						if (res.success) {

							let data = res.data
							console.log("返回的data:" + JSON.stringify(data))
							console.log("返回的res.msg:" + res.msg)
							that.$u.toast(res.msg);
						} else {
							this.errContent = res.msg
							this.dialogToggle('error')
						}

					});
			},
			dialogToggle(type) {
				this.msgType = type
				this.$refs.alertDialog.open()
			},
		}

	}
</script>
<style lang="scss" scoped>
	@import '../../common/index.scss';
	@import '../../common/base-change.scss';
	// 样式覆盖基础样式 挤压后,解决线条覆盖
	.wrap {
		.example-body{
			.u-form{
				.u-form-item{
					margin-bottom: -10rpx !important;
					margin-top:-10rpx !important
				}
			}
		}
	}
</style>
